<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="zh-CN">
<th:block th:replace="common/head :: head(text='新增提醒')"/>
<link rel="stylesheet" type="text/css" th:href="@{/css/admin/main.css}"/>
<body>
<div class="container">
    <th:block th:replace="common/sidebar :: sidebar(flag='remind')"/>
    <div class="main-content">
        <div id="information">
            <h2  th:text="${message}"></h2>
            <form th:action="@{${flag == 2 ? '/remind/editRemindInfo' : '/remind/addRemindInfo'}}" method="post" th:object="${remindInfoVo}">
                <div class="form-group" style="display: inline-block">
                    <label for="to-user" class="label-t">提醒人:</label>
                    <select id="to-user" name="to-user" th:field="${remindInfoVo.toUser}" th:disabled="${flag == 1 ? 'true' : 'false'}">
                        <option th:each="sendUserInfo:${sendUserInfoList}" th:value="${sendUserInfo.toUser} + '-' + ${sendUserInfo.toUserNick}" th:text="${sendUserInfo.toUserNick}"></option>
                    </select>
                </div>
                <div class="form-group" style="display: inline-block">
                    <label for="type" class="label-t" style="margin-left: 150px">提醒方式:</label>
                    <select id="type" name="type" th:onclick="select()" th:field="${remindInfoVo.type}" th:disabled="${flag == 1 ? 'true' : 'false'}">
                        <option value="text" >文本提醒</option>
                        <option value="news">图文提醒</option>
                    </select>
                </div>
                <div class="form-group" style="display: inline-block">
                    <label for="start" class="label-t" style="margin-left: 150px">是否执行:</label>
                    <select id="start" name="start" th:field="${remindInfoVo.start}" th:disabled="${flag == 1 ? 'true' : 'false'}">
                        <option value="1">是</option>
                        <option value="2">否</option>
                    </select>
                </div>
                <div class="form-group">
                    <label for="time" class="label-t">提醒时间:</label>
                    <input type="text" id="time" name="time" class="input-t" th:field="${remindInfoVo.time}" th:disabled="${flag == 1 ? 'true' : 'false'}">
                </div>
                <div class="form-group">
                    <label for="title" class="label-t">提醒标题:</label>
                    <input type="text" id="title" name="title" class="input-t" th:field="${remindInfoVo.title}" th:disabled="${flag == 1 ? 'true' : 'false'}">
                </div>
                <div class="form-group">
                    <label for="content">提醒内容:</label>
                    <textarea type="text" id="content" name="content" th:field="${remindInfoVo.content}" th:disabled="${flag == 1 ? 'true' : 'false'}"></textarea>
                </div>

                <div id="news" th:style="${remindInfoVo.type != 'news' ? 'display: none' : 'display: block'}">
                    <div class="form-group">
                        <label for="url" class="label-t">跳转连接:</label>
                        <input type="text" id="url" name="url" class="input-t" th:field="${remindInfoVo.url}" th:disabled="${flag == 1 ? 'true' : 'false'}">
                    </div>
                    <div class="form-group">
                        <label for="picture" class="label-t">图文图片:</label>
                        <input type="text" id="picture" name="picture" class="input-t" th:field="${remindInfoVo.picture}" th:disabled="${flag == 1 ? 'true' : 'false'}">
                    </div>
                </div>

                <input type="text" id="tableId" name="tableId" class="input-t" th:value="${id}" style="display: none">
                <input type="text" id="remindId" name="remindId" class="input-t" th:value="${remindInfoVo.remindId}" style="display: none" >


                <div class="button-container" th:style="${flag == 1 ? 'display: none' : 'display: block'}">
                    <button type="submit">保存</button>
                </div>
            </form>
        </div>
    </div>
</div>
</body>
<script type="text/javascript">
    let newsEl = document.getElementById("news");
    function select(){
        let selectEl = document.getElementById("type");
        let selectedIndex = selectEl.selectedIndex;
        let value = selectEl.options[selectedIndex].value;

        if(value === 'text'){
            newsEl.style.display = 'none';
        }else {
            newsEl.style.display = 'block';
        }
    }
</script>
</html>
